<div class="map-container">
  <ngx-ol-map>
    <ngx-ol-view [center]="[12950068.2271403, 4864666.040194729]" [zoom]="15"></ngx-ol-view>
    <ngx-ol-map-graticule [visible]="mapGraticuleVisible$ | async"></ngx-ol-map-graticule>
    <ege-interaction-draw></ege-interaction-draw>
    <ege-map-marker></ege-map-marker>
    <div class="position-absolute layout-search">
      <ege-map-search></ege-map-search>
    </div>
    <div class="position-absolute layout-city">
      <ege-map-city></ege-map-city>
    </div>
    <div class="position-absolute layout-top-right" #layoutTopRight>
      <div class="folding-container">
        <ege-folding-container [options]="{
          'title': '底图切换',
          'type': 'BASEMAPS',
          'imgSrc': '/assets/images/folding-container-icon.png',
          'iconType': 'img'
        }">
        <ege-map-basemaps></ege-map-basemaps>
      </ege-folding-container>
      </div>
      <div class="folding-container">
        <ege-folding-container [options]="{
          'title': '图层管理',
          'type': 'LAYERS',
          'icon': 'ege ege-layers',
          'clickDocumentHide': false
        }">
          <ege-map-layers-management></ege-map-layers-management>
        </ege-folding-container>
      </div>
      <div class="folding-container">
        <ege-folding-container [options]="{
          'title': '资源树',
          'type': 'RESOURCETREE',
          'icon': 'ege ege-source-tree',
          'button': true,
          'deactiveByOther': false,
          'deactiveOther': false,
          'clickDocumentHide': false
        }"></ege-folding-container>
      </div>
      <div class="folding-container">
        <ege-folding-container [options]="{
          'title': '绘图工具',
          'type': 'SPATICLFILTERING',
          'icon': 'ege ege-draw',
          'style': 'ellipse',
          'clickDocumentHide': false
        }">
          <ege-draw-tool></ege-draw-tool>
        </ege-folding-container>
      </div>
      <div class="folding-container">
        <ege-folding-container [options]="{
          'title': '地图网格',
          'type': 'GRID',
          'icon': 'ege ege-gird',
          'button': true,
          'deactiveOther': false,
          'deactiveByOther': false,
          'clickDocumentHide': false
        }"></ege-folding-container>
      </div>
      <div class="folding-container">
        <ege-folding-container [options]="{
          'title': '文件上传',
          'type': 'UPLOAD',
          'icon': 'anticon anticon-cloud-upload',
          'button': true,
          'deactiveOther': false,
          'deactiveByOther': false,
          'clickDocumentHide': false
        }"></ege-folding-container>
      </div>
      
    </div>
    <div class="position-absolute layout-bottom" #layoutBottom>
      <div class="position-absolute layout-zoom">
        <ege-map-zoom></ege-map-zoom>
      </div>
      <div class="position-absolute layout-information">
        <ege-map-information></ege-map-information>
      </div>
    </div>
  </ngx-ol-map>
  <ege-map-data-table [height]="'320px'"></ege-map-data-table>
  <ng-template #resourceTree></ng-template>
  <div #featureProperty></div>
</div>